<template>
    <div class="zhipu-quality">
        <editor-title
            title="视频帧率"
            tips="视频帧率(FPS)"
            required
        />

        <el-select
            v-model="value"
            placeholder="请选择模式"
            class="w-full mt-[8px]"
            size="large"
        >
            <el-option
                v-for="(item, key) in options"
                :key="item"
                :label="item"
                :value="key"
            >
                {{item }}
            </el-option>
        </el-select>
    </div>
</template>

<script setup lang="ts">
import { useVModels } from '@vueuse/core'
import editorTitle from '../editor-title.vue'

const emits = defineEmits<{
    (event: 'update:modelValue', value: string): void
}>()

const props = withDefaults(
    defineProps<{
        modelValue: string | undefined;
    }>(),
    {}
)

const { modelValue: value } = useVModels(props, emits)

const options = {
    30: '30fps',
    60: '60fps'
}
</script>
